<template>
  <div>
    <h2>Child</h2>

    <input v-model="cv" />

    {{ props }}
    <!-- MyComponent -->
    <!-- 子组件发生事件 -->
    <button @click="$emit('submit', {})">Click Me</button>

    <!-- 
      error ,属性从父到子是单向的
      <button @click="props.foo = 'new value'">Update foo</button>  -->
  </div>
</template>

<script setup>
import { ref } from 'vue'
// 自定义的属性相当于一个响应式变量
const props = defineProps(['foo', 'bar'])
// 定义组件事件
const emits = defineEmits(['inFocus', 'submit'])

const cv = ref(1)
</script>
